<template>
  <!-- <app-view class="family">
    <scroll-view>
      <banner />
      <card :show-top="false" class="whiteBorder">
        <menu-item
          v-for="menu in parentMenus"
          :key="menu.menuId"
          :src="menu.icon"
          :title="menu.title"
          @click="onMenu(menu)"
        />
      </card>
    </scroll-view>
    <choose-child-popup
      v-model="showChildrenPopup"
      close-on-click-overlay
      :children="userInfo.children"
      @change="onConfirmChild"
    />
  </app-view> -->
  <view class="family">
	  <scroll-view scroll-y="true" >
	  	<view>
			<banner />
		</view>
	  </scroll-view>
  </view>
</template>

<script>
  import { isEmpty, copy } from '@common/utils';
  import { mapGetters, mapActions, mapMutations } from 'vuex';
  // import MenuItem from '@views/home/components/menu-item';
  // import ChooseChildPopup from '@views/home/components/choose-child-popup';
  // import banner from '@views/home/rolePages/family/components/parent/banner.vue';
  // import news from '@views/home/rolePages/family/components/parent/news.vue';
  import { phoneMenu } from '@api/home';

  export default {
    data() {
      return {
        showChildrenPopup: false,
        parentMenus: [
          {
            checked: null,
            children: null,
            icon: require('@static/logo.png'),
            isDeleted: '0',
            isLeaf: null,
            isShow: '1',
            menuId: '77',
            name: '/attendance/parent/dorm',
            parentId: '37',
            perms: '',
            placeId: null,
            shape: '0',
            sort: '1010',
            title: '宿舍考勤',
            type: '2',
            url: null
          },
          {
            checked: null,
            children: null,
            icon: require('@static/logo.png'),
            isDeleted: '0',
            isLeaf: null,
            isShow: '1',
            menuId: '79',
            name: '/attendance/parent/inout-school',
            parentId: '37',
            perms: '',
            placeId: null,
            shape: '0',
            sort: '1010',
            title: '进出校',
            type: '2',
            url: null
          },
          {
            checked: null,
            children: null,
            icon: require('@static/logo.png'),
            isDeleted: '0',
            isLeaf: null,
            isShow: '1',
            menuId: '52',
            name: '/attendance/course',
            parentId: '37',
            perms: '',
            placeId: null,
            shape: '0',
            sort: '1010',
            title: '课程表',
            type: '2',
            url: null
          },
          {
            checked: null,
            children: null,
            icon: require('@static/logo.png'),
            isDeleted: '0',
            isLeaf: null,
            isShow: '1',
            menuId: '38',
            name: '/visitor/index',
            parentId: '36',
            perms: '',
            placeId: null,
            shape: '0',
            sort: '10',
            title: '访客预约',
            type: '1',
            url: null
          },
          {
            checked: null,
            children: null,
            icon: require('@static/logo.png'),
            isDeleted: '0',
            isLeaf: null,
            isShow: '1',
            menuId: '39',
            name: '/transcript/index',
            parentId: '36',
            perms: '',
            placeId: null,
            shape: '0',
            sort: '10',
            title: '学生成绩单',
            type: '1',
            url: null
          }
        ]
      };
    },
    provide() {
      return {
        onSwitchChild: this.switchChild
      };
    },
    computed: {
      ...mapGetters('user', ['userInfo', 'userRoles', 'userRole', 'userTodoBadge']),
      ...mapGetters('wechat', ['isConfigSuccess'])
    },
    created() {
      this.qryChildrenInfo();
    },
    methods: {
      ...mapMutations('user', ['setUserInfo']),
      ...mapActions('user', ['getUserChildren']),
      onMenu(menu = {}) {
        if (!isEmpty(menu.children)) {
          this.popupMenus = menu.children;
          return (this.showPopup = true);
        }
        if (menu.name) this.$router.push(menu.name);
      },
      getPhoneMenu() {
        const { placeRoleId } = this.userRole;

        if (isEmpty(placeRoleId)) return false;

        phoneMenu(placeRoleId).then(({ success, msg, data }) => {
          // this.menus = success ? sort(data) : [];
        });

        const sort = (array) => {
          for (let i = 0; i < array.length; i++) {
            if (!isEmpty(array[i].children)) {
              array[i].children = sort(array[i].children);
            }
          }
          return array.sort((a, b) => a.sort - b.sort);
        };
      },
      // 家长--查询子女信息
      qryChildrenInfo() {
        this.getUserChildren().then(({ success, msg, data }) => {
          if (!success) return this.$toast(msg);
        });
      },
      // banner change
      onChange(index) {},
      // 家属切换子女
      switchChild() {
        this.children = copy(this.userInfo.children);
        this.showChildrenPopup = true;
      },
      // 选取了某个子女
      onConfirmChild(value) {
        var user = copy(this.userInfo);
        user.curChild = value;
        this.setUserInfo(user);
      }
    }
  };
</script>

<style scoped lang="less">
  .farmily {
    /deep/ .van-swipe-item {
      width: 100%;
      height: 140px;
      padding: 0 15px;
    }

    /deep/ .van-button__text {
      display: flex;
      flex-flow: row;
      align-items: center;
      justify-content: space-between;
    }
  }
  .whiteBorder {
    border-top-color: white;
  }
</style>
